<!DOCTYPE HTML>
<html lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<link rel="shortcut icon" href="${ctxPath}/static/image/favicon.ico" type="image/x-icon" />
<title>柒色都吧问卷-${survey.title}</title>
<!-- Bootstrap 核心 CSS 文件 -->
<link href="${ctxPath}/static/bootstrop/css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="${ctxPath}/static/js/jquery.min.js"></script>
<!-- Bootstrap 核心 JavaScript 文件 -->
<script src="${ctxPath}/static/bootstrop/js/bootstrap.min.js"></script>
<!-- layer 核心 JavaScript 文件 -->
<script src="${ctxPath}/static/layer/layer.js"></script>
<!-- 自定义样式 -->
<link  href="${ctxPath}/static/css/7dub_diy.css" rel="stylesheet">
<!-- 自定义js函数 -->
<script src="${ctxPath}/static/js/default.js"></script>
</head>
<body style="background:url(${ctxPath}/static/image/skin-paper2.png);">
<!-- main start -->
<div class="surBox" style="background-color: #FFF;margin-bottom:30px;/* background:url(${ctxPath}/static/image/bzdsj.jpg);background-repeat: repeat-x; */ ">
<!--  -->
<% if(!survey.isOpen){%>
	<script type="text/javascript">
	/* -----以下代码用于判断是否需要弹出邀请码输入框 ---- */	
		var index = layer.open({
		    type: 1,
		    title: '非公开问卷请输入邀请码',
		    closeBtn:false,
		    shadeClose:false,
		    area: ['255px', '73px'],
		    skin: 'editQuestionBox',
		    content: '<form id="sendPwdForm"  class="form-inline"><input type="hidden" id="surveyId" name="surveyId" value="${survey.id}"/><input type="password" name="pwd" class="form-control" id="pwdBox" placeholder="Password" >　<button type="button" class="btn btn-default" onclick="sendPwd();">确认</button></form>'
		});
		
		/* -----以下代码用于校验邀请码 ---- */
		function sendPwd(sid){
		    var pwd = $("#pwdBox").val(); // 密码
		    var sid = $("#surveyId").val(); // sid
		    if(pwd.length > 0){
		        $.post(
			    		"../checkPwd",
			    		$("#sendPwdForm").serialize(),
			    		function(data) {
			    			if(data) {
			    			    layer.close(index);
			    			}else{
			    			    layer.tips('邀请码错误！', '#pwdBox',{
			    		            tips: [3, '#3595CC'],
			    		            time: 3000
			    		        });
			    			}
			    		},
				    	"json"
			    ); 
		    }
		    else{
		        layer.tips('邀请码不能为空！', '#pwdBox',{
		            tips: [3, '#3595CC'],
		            time: 3000
		        });
		    }
		}
	</script>
<% } %>

<!-- 当前问卷展示 start -->
	<div class="currentSurveyBox">
		<div class="surveyhead">${survey.title}</div>
		<div>${survey.sdesc}</div>
		<div style="float:left;color: #333;">作者：${survey.author}　|　发布时间：<script type="text/javascript">document.write(getLocalTime(${survey.createTime}));</script> | 结束时间：<script type="text/javascript">document.write(getLocalTime(${survey.expireTime}));</script></div>
		<div class="bdsharebuttonbox" style="float: right;">
		<a href="#" class="bds_more" data-cmd="more">分享到：</a><a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间">QQ空间</a><a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博">新浪微博</a><a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信">微信</a><a href="#" class="bds_sqq" data-cmd="sqq" title="分享到QQ好友">QQ好友</a>
		</div>
		<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"分享问卷-${survey.title}","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"1","bdSize":"16"},"share":{"bdSize":16}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
		<div class="surveydescription"></div>
		<div id="qq">
			<div class="qaViewBox">
				<% for(qu in questionInfo) {%>
				<div class="singleQaBox" id="${qu.id}">
					<div class="div_title_question"><b>${quLP.index}.</b>${qu.head}<span style="color:red;">&nbsp;*</span></div>
					<div class="div_table_question">
						<ul class="ulradiocheck">
						<% for(option in qu.options) {%>
							<% if(qu.type == "SINGLE"){%>
							<li><label><input type="radio" name="${qu.id}" value="${option.id}">　${option.content}</label></li>
							<%}if(qu.type == "MULTIPLE"){%>
							<li><label><input type="checkbox" name="${qu.id}" value="${option.id}">　${option.content}</label></li>
							<%}%>
						<%}%>
						</ul>
					</div>
				</div>
				<%}elsefor{%>
				还没有题目，无法填写问卷......
				<%}%>
			</div>
		</div>
<form id="currentSurveyForm" action="" method="post">
	<input type="hidden" name="surveyId" id="surveyId" value="${survey.id}" />
	<input type="hidden" name="result" id="result" value="" />		
		<div style="text-align:center;"><button type="button" id="btnSubmit" class="btn btn-primary"> 我 填 好 了 </button></div>
</form>
	</div>
	
	<div style="text-align:center;margin-top:10px;"><i class="glyphicon glyphicon-education"></i>　柒色都吧问卷网　强力驱动</div>

<!-- 当前问卷展示 end -->
</div>
<!-- main end -->


<!-- 进度条 start -->
<div class="edit-progress">
	<div class="progress" style="margin:0 auto;width:930px">
	  <div id="progress-bar" style="font-size:20px;color:red;" class="progress-bar  progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" >
	    0%
	  </div>
	</div>
</div>
<!-- 进度条  end -->

<script type="text/javascript">
/*------判断radio是否有选中，获取选中的值--------*/  
$(function(){
    var infoSize = ${questionInfo.~size}; // 问卷题目总数
    var editSize = 0 ; // 已填写题目数目
    var par = 0 ; // 填写进度
    $(".singleQaBox").click(function(){
        /* --- 初始化单个题目框样式  ---*/
        $(this).css("border-bottom-color","#d8d8d8");
        editSize = 0 ; // 初始化已填写题目数目
        
        /* --- 以下代码用于计算和检查  ---*/
        <% for(qu in questionInfo) {%>
    	 <% if(qu.type == "SINGLE"){%>
        	var val_${quLP.index} = $('input:radio[name="${qu.id}"]:checked').val();  
        <%}if(qu.type == "MULTIPLE"){%>
        	var val_${quLP.index} = $('input:checkbox[name="${qu.id}"]:checked').val(); 
        <%}%>
        
	        if(val_${quLP.index}!=null){  
	            editSize++;
	        }  
    	<% } %>
    
    /* 计算填写进度并显示  */
     par = parseInt((editSize / infoSize) * 100);
    $("#progress-bar").css("width", par + "%");
    $("#progress-bar").text( par + "%");
    
    });
    
    /* 以下代码用于提交时校验和组装格式化数据 */
     $("#btnSubmit").click(function(){
         var result = ""; // 答案结果信息
         editSize = 0 ; // 初始化已填写题目数目
         <% for(qu in questionInfo) {%>
         	 <% if(qu.type == "SINGLE"){%>
	         	var val_${quLP.index} = $('input:radio[name="${qu.id}"]:checked').val();  
	         <%}if(qu.type == "MULTIPLE"){%>
	         	var val_${quLP.index} = "";
	         	$('input:checkbox[name="${qu.id}"]:checked').each(function(i){ 
	         	    if(i + 1 == $('input:checkbox[name="${qu.id}"]:checked').length){
	         	       val_${quLP.index} += $(this).val();
	         	    }else{
	         	       val_${quLP.index} += $(this).val() + ",";
	         	    }
	         	    
	         	});
	         <%}%>
	         
	         if(val_${quLP.index}==null || val_${quLP.index}.length==0){  
	             layer.tips("什么都没选呢！", "#${qu.id}",{
	        	        tips: [2, '#78BA32'] ,tipsMore: true,time: 5000
	        	    });
	             $("#${qu.id}").css("border-bottom-color","red");
	         }  
	         else{  
	             editSize++;
	             if(editSize == infoSize){
	                 result += "${qu.id}:oprelt=" + val_${quLP.index} + ";text="; // 组装格式化答案
	             }else{
	                 result += "${qu.id}:oprelt=" + val_${quLP.index} + ";text=|#|"; // 组装格式化答案
	             }
	             $("#result").val(result);
	         }  
         <% } %>
         
         //alert(result); 
         if($("#result").val().length>0 && $("#surveyId").val().length>0 && par == 100 && infoSize > 0){
             //确认框
             layer.confirm('你确定要提交么？', {icon:4}, function(index){
                 layer.close(index);
                 $.post(
             			"${ctxPath}/manager/addAnswer",
             			$("#currentSurveyForm").serialize(),
             			function(data) {
             			   layer.msg(data.msg, {icon: 16},function(){
             			      // 关闭后的操作
             			      if(data.status) {
             			       location.href="${ctxPath}/manager/resualtInfo"; 
                 			   }
             			   });
             			},
             	    	"json"
             		);
             });
         }
     });  
 });  
</script>

</body>
</html>